<template>
    <div id="show">
        <img :src="icon">
        <p>打开生活,发现美好</p>
        <va-avatar icon="arrow_forward" color="danger" size="42px" @click="ToLogin"/>
    </div>
</template>

<script>
import {useRouter} from 'vue-router'
export default{
    setup() {
        const icon=require('../assets/addphoto.png');   
        const router=useRouter();
        const ToLogin=()=>{
            router.push({
                path:'/login'
            })
        } 
        return {icon,ToLogin}
    }
}
</script>

<style scoped>
#show{
    width: 375px;
    height: 667px;
    background-image: url(../assets/bg1.png);
}
p{
    color: white;
    font-size: 16px;
    font-weight: bold;
    position: absolute;
    left: 125px;
    top:345px;
}
.va-avatar{
    position: absolute;
    top:387px;
    left: 168px;
    animation:backInLeft;
    animation-duration:1s;
}
img{
    width: 58px;
    height: 58px;
    position: absolute;
    left: 160px;
    top:278px;
    animation: rotateInDownLeft;
    animation-duration:1s;
}
</style>